<script lang="jsx" setup>
import { ref } from 'vue';
import ProductionReportPage from '@/components/common/production-report-page/index.vue';
import { useAuthStore } from '@/store/modules/auth';

const authStore = useAuthStore();

const formList = [
  {
    type: 'input',
    key: 'moduleNo',
    label: '生产型号',
    placeholder: '请输入生产型号',
    span: 24,
    md: 12,
    lg: 6,
    xl: 8,
    xxl: 4
  },
  {
    type: 'input',
    key: 'serialNum',
    label: '单据号',
    placeholder: '请输入单据号',
    span: 24,
    md: 12,
    lg: 6,
    xl: 8,
    xxl: 4
  },
  {
    type: 'select',
    key: 'state',
    label: '审核状态',
    placeholder: '请选择审核状态',
    span: 24,
    md: 12,
    lg: 6,
    xl: 8,
    xxl: 4,
    selectOptions: [
      {
        value: '0',
        label: '待领班审核'
      },
      {
        value: '1',
        label: '待修改'
      },
      {
        value: '2',
        label: '待主管审核'
      },
      {
        value: '3',
        label: '审核完成'
      }
    ]
  },
  {
    type: 'dateRangePicker',
    key: 'time',
    label: '时间',
    showTime: true,
    span: 24,
    md: 12,
    lg: 6,
    xl: 8,
    xxl: 6
  }
];

const column = [
  {
    key: 'dataIndex',
    dataIndex: 'dataIndex',
    title: '序号',
    width: 70,
    fixed: 'left',
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'moduleNo',
    dataIndex: 'moduleNo',
    title: '生产型号',
    width: 150,
    align: 'center',
    fixed: 'left',
    checked: true,
    ellipsis: true
  },
  {
    key: 'serialNum',
    dataIndex: 'serialNum',
    title: '单据号',
    width: 130,
    align: 'center',
    fixed: 'left',
    checked: true,
    ellipsis: true
  },
  {
    key: 'state',
    dataIndex: 'state',
    title: '状态',
    width: 120,
    align: 'center',
    checked: true,
    ellipsis: true,
    customRender: ({ record }) => {
      return ['待领班审核', '待修改', '待主管审核', '审核完成'][record.state];
    }
  },
  {
    key: 'time',
    dataIndex: 'time',
    title: '时间',
    width: 170,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'passBoard',
    dataIndex: 'passBoard',
    title: 'pass板',
    width: 100,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'ngBoard',
    dataIndex: 'ngBoard',
    title: 'ng板',
    width: 100,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'machineNo',
    dataIndex: 'machineNo',
    title: '机台号',
    width: 100,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'result',
    dataIndex: 'result',
    title: '处理结果',
    width: 100,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'operator',
    dataIndex: 'operator',
    title: '检验员',
    width: 100,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'shiftType',
    dataIndex: 'shiftType',
    title: '班别',
    width: 120,
    align: 'center',
    checked: true,
    ellipsis: true,
    customRender: ({ record }) => {
      return ['白班', '夜班'][record.shiftType];
    }
  },
  {
    key: 'foreman',
    dataIndex: 'foreman',
    title: '领班审核',
    width: 100,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'foremanTime',
    dataIndex: 'foremanTime',
    title: '领班审核时间',
    width: 170,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'examiner',
    dataIndex: 'examiner',
    title: '主管审核',
    width: 100,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'examinerTime',
    dataIndex: 'examinerTime',
    title: '主管审核时间',
    width: 180,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'remark',
    dataIndex: 'remark',
    title: '备注',
    width: 180,
    align: 'center',
    checked: true,
    ellipsis: true
  },

  {
    key: 'createTime',
    dataIndex: 'createTime',
    title: '创建时间',
    width: 180,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'updateTime',
    dataIndex: 'updateTime',
    title: '修改时间',
    width: 180,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'updateBy',
    dataIndex: 'updateBy',
    title: '修改人',
    width: 100,
    align: 'center',
    checked: true,
    ellipsis: true
  }
];

const btnAuth = {
  add: 'single-test-stardard-board:add',
  edit: 'single-test-stardard-board:edit', // 编辑修改权限
  del: 'single-test-stardard-board:del', // 删除权限
  foremanAudit: 'single-test-stardard-board:foremanAudit', // 领班审核权限
  supervisorAudit: 'single-test-stardard-board:supervisorAudit', // 主管审核权限
  withdrawTrial: 'single-test-stardard-board:withdrawTrial', // 撤审权限
  download: 'single-test-stardard-board:download' // 导出
};

const topFormList = [
  {
    type: 'searchInput',
    key: 'moduleNo',
    label: '生产型号',
    span: 12,
    tansfromDisabled(operateType) {
      return operateType === 'look';
    },
    disabled: false,
    rule: {
      required: true,
      message: '请输入生产型号',
      trigger: 'change'
    },
    transfromSearch(model, searchData) {
      // model.value = searchData;
      Object.keys(model.value).forEach(item => {
        model.value[item] = searchData[item] || model.value[item];
      });
    },
    handleSearch(e, val) {
      console.log('val :>> ', val);
    }
  },
  {
    type: 'datePicker',
    key: 'time',
    label: '日期',
    span: 12,
    tansfromDisabled(operateType) {
      return operateType === 'look';
    },
    showTime: true,
    rule: {
      required: true,
      message: '请选择日期',
      trigger: 'blur'
    }
  },
  {
    type: 'radio',
    key: 'passBoard',
    label: 'pass板',
    span: 8,
    tansfromDisabled(operateType) {
      return operateType === 'look';
    },
    defaultValue: 'OK',
    showReset: true,
    selectOptions: [
      {
        label: 'OK',
        value: 'OK'
      },
      {
        label: 'NG',
        value: 'NG'
      }
    ],
    rule: {
      required: true,
      message: '请选择状态',
      trigger: 'blur'
    }
  },
  {
    type: 'radio',
    key: 'ngBoard',
    label: 'ng板',
    span: 8,
    tansfromDisabled(operateType) {
      return operateType === 'look';
    },
    showReset: true,
    defaultValue: 'OK',
    selectOptions: [
      {
        label: 'OK',
        value: 'OK'
      },
      {
        label: 'NG',
        value: 'NG'
      }
    ],
    rule: {
      required: true,
      message: '请选择状态',
      trigger: 'blur'
    }
  },
  {
    type: 'input',
    key: 'machineNo',
    label: '机台号',
    span: 8,
    tansfromDisabled(operateType) {
      return operateType === 'look';
    },
    disabled: false,
    rule: {
      required: true,
      message: '请输入机台号',
      trigger: 'change'
    }
  },
  {
    type: 'input',
    key: 'result',
    label: '处理结果',
    span: 8,
    defaultValue: '合格',
    tansfromDisabled(operateType) {
      return operateType === 'look';
    },
    disabled: false
  },
  {
    type: 'radio',
    key: 'shiftType',
    label: '班别',
    span: 8,
    tansfromDisabled(operateType) {
      return operateType === 'look';
    },
    showReset: true,
    selectOptions: [
      {
        label: '白班',
        value: '0'
      },
      {
        label: '夜班',
        value: '1'
      }
    ],
    rule: {
      required: true,
      message: '请选择班别',
      trigger: 'blur'
    }
  },
  {
    type: 'textarea',
    key: 'remark',
    label: '备注',
    tansfromDisabled(operateType) {
      return operateType === 'look';
    },
    textareaRows: 1,
    span: 8
  }
];
const bottomList = [
  {
    type: 'input',
    key: 'operator',
    label: '检验员',
    defaultValue: authStore.userInfo.user.nickName || authStore.userInfo.user.userName,
    tansfromDisabled(operateType) {
      return operateType === 'look';
    },
    span: 8
  },
  {
    type: 'input',
    key: 'foreman',
    label: '领班审核',
    disabled: true,
    span: 8
  },
  {
    type: 'input',
    key: 'examiner',
    label: '主管审核',
    disabled: true,
    span: 8
  }
];

const searchParam = ref({
  moduleNo: null,
  state: null,
  time: null
});
</script>

<template>
  <ProductionReportPage
    :search-form-list="formList"
    :column="column"
    url="/qms/single/singleTestStardardBoard/list"
    :btn-auth="btnAuth"
    form-id="108"
    :search-param="searchParam"
    :top-form-list="topFormList"
    :bottom-list="bottomList"
  />
</template>

<style></style>
